export const code = `<script setup>
    import { code } from './code/case3.js';
    import * as echarts from 'echarts';
    import { onMounted } from 'vue';
    const svgpath = 'M51.911,16.242C51.152,7.888,45.239,1.827,37.839,1.827c-4.93,0-9.444,2.653-11.984,6.905 c-2.517-4.307-6.846-6.906-11.697-6.906c-7.399,0-13.313,6.061-14.071,14.415c-0.06,0.369-0.306,2.311,0.442,5.478 c1.078,4.568,3.568,8.723,7.199,12.013l18.115,16.439l18.426-16.438c3.631-3.291,6.121-7.445,7.199-12.014 C52.216';
    onMounted(() => {
        // 基于准备好的dom，初始化echarts实例
        const dom = document.getElementById('scatter-case-3');
        const myChart = echarts.init(dom, 'dark', { renderer: 'svg' });

        // 绘制图表

        /** @type {echarts.EChartsOption} */
        const option = {
            title: { text: '散点图样式设置' },
            tooltip: {},
            xAxis: {
                type: 'category',
                data: ['衬衫', '羊毛衫', '雪纺衫', '裤子', '高跟鞋', '袜子'],
            },
            yAxis: { type: 'value' },
            series: [
                {
                    name: '销量',
                    type: 'scatter',
                    data: [5, 20, 36, 10, 10, 20],
                    label: { show: true, position: 'top' },
                    // ★★★图形的形状
                    symbol: \`path://$\{svgpath}\`,
                    /** ★★★图形大小 */
                    symbolSize (value) {
                        return value;
                    },
                },
            ],
        };
        myChart.setOption(option);
    });
</script>
`;
